import React from "react"
import "./style.less"
// import SearchInput from "../SearchInput"
import { Link } from "react-router-dom"

export default class HomeHeadSearch extends React.Component{
    constructor(){
        super();
        this.state = {
            searchKeyWord: ''
        }
    }
    getKeyWordHandel(event){
        this.setState({
            searchKeyWord: event.target.value
        })
    }
    getFocusHandle(){
        this.props.history.push('/hotsearch/')
       
    }

    render (){
        return (
            <div className="home-header-container">
                <div className="home-header-left">
                    <Link to="/locate">
                        <i className={this.props.localIcon}></i>
                    </Link>
                </div>
                <div className="home-header-middle">
                    <div className="search-container">
                        <input 
                            type="text" 
                            placeholder="搜索您想住的区域或小区"
                            onChange={this.getKeyWordHandel.bind(this)}
                            onFocus={this.getFocusHandle.bind(this)}
                            />
                        <i className="iconfont icon-sousuo1"></i>
                    </div>
                </div>
                <div className="home-header-right">
                    <Link to="/message">
                        <i className={this.props.msgIcon}></i>
                    </Link>
                </div>
            </div>
        )
    }

}
